<template>
   <div class="setup-view" v-if="typeUrl==1">
       <setUp />
   </div>
   <div class="setup-view" v-else>
       <main-wrap :bodyStyle="{height:'100%',overflow: 'hidden'}">
       <setUp />
       </main-wrap>
   </div>
</template>

<script>
import {reactive,toRefs, onMounted,computed } from 'vue'
import { useStore } from 'vuex'
import {useRoute,useRouter} from 'vue-router'
import mainWrap from '@/components/mainWrap.vue'
import {toast} from '@/utils/common.js'
import myButton from '@/components/myButton.vue'
import payRule from './components/payRule.vue'
import distributionRule from './components/distributionRule.vue'
import setUp from '../global/setUp.vue'
export default {
    components:{
        mainWrap,
        myButton,
        payRule,
        setUp
    },
    setup(){
        const store = useStore()
        const route = useRoute()

        const state = reactive({
            showFlag:false,
            openType:'',
            arLandmarkId:'',
            typeUrl:'',
            ruleDetail:{}
        })

        onMounted(()=>{
            console.log(router)
            
            state.typeUrl = route.query.typeUrl ||''
            state.arLandmarkId = route.query.arlandmarkid ||route.query.arLandmarkId 
            getRuleDetail()
        })

        const getRuleDetail = async ()=>{
           const res = await store.dispatch('ad/get_rule_detail',state.arLandmarkId)
           state.ruleDetail = res.data || {}
        }

        const openDg= (flag)=>{
            state.openType = flag
            state.showFlag = true
        } 
        
        const closeDg = ()=>{
            state.showFlag=false
            getRuleDetail()
        }

        return {
            ...toRefs(state),
            openDg,
            closeDg
        }
    }
}
</script>

<style lang="scss" scoped>
 .setup-view{
     height:100vh;
 }
</style>